<template lang="">
    <div>
        <div class="header">
            <el-button type="text" @click="logout">退出登录</el-button>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'Header',
        methods: {
            logout() {
                this.$confirm('确认退出登录?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    axios({
                        method: 'POST',
                        url: '/logout',
                        withCredentials: true,
                    }).then((result) => {
                        let key = window.btoa('isLogin')
                        sessionStorage.removeItem(key)
                        this.$router.replace('/')
                        location.reload()
                    }).catch((err) => {
                        this.$message({
                            message:'登出失败'+err.message,
                            type:'info'
                        })
                    });
                }).catch(() => {
                    
                });
            }
        },
    }
</script>
<style scoped>
    .header {
        float: right;
    }

    .el-button {
        color: #fff;
    }
</style>